/**
 * Created by 1 on 2019/11/6.
 */
$(function() {
    var i = 0
    /* 克隆最后一张图片 */
    var clone = $('#lunbo1 li').eq(0).clone()
    $('#lunbo1').append(clone)

    /* 页面动态添加小圆点 */
    var size = $('#lunbo1 li').length
    for(var i = 0; i < size-1; i++) {
        var li = '<li></li>'
        $('#lunbo2').append(li)
    }

    /* 给第一个小圆点添加class: wh */
    $('#lunbo2 li').eq(0).addClass('wh')

    /* 小圆点添加点击事件 */
    $('#lunbo2 li').click(function() {
        var i = $(this).index()
        console.log(i)
        $(this).addClass('wh').siblings().removeClass('wh')
        $('#lunbo1').stop().animate({
            left: -350 * i + 'px'
        }, 5000)
    })

    /* 左右按钮添加事件 */
    $('.l_l').click(function() {
        i--
        console.log(i)
        move()
    })
    $('.l_r').click(function() {
        i++
        move()
    })

    /* 鼠标移入lunbo时，显示左右按钮 */
    /* 鼠标移出lunbo时，隐藏左右按钮 */
    $('.lunbo').hover(function() {
        $('.l_l').stop().show()
        $('.l_r').stop().show()
        clearInterval(t)
    }, function() {
        $('.l_l').stop().hide()
        $('.l_r').stop().hide()
        t = setInterval(function() {
            i++
            move()
        }, 5000)
    })

    /* 添加定时器 */
    var t = setInterval(function() {
        i++
        move()
    }, 5000)


    /* 轮播图主函数 */
    function move() {
        if(i == -1) {
            i = size - 2
            $('#lunbo1').css({
                left: -350 * (i+1) + 'px'
            })
        }

        if(i == size) {
            i = 1
            $('#lunbo1').css({
                left: 0
            })
        }

        $('#lunbo1').stop().animate({
            left: -350 * i + 'px'
        }, 5000)

        if(i == size-1) {
            $('#lunbo2 li').eq(0).addClass('wh').siblings().removeClass('wh')
        } else {
            $('#lunbo2 li').eq(i).addClass('wh').siblings().removeClass('wh')
        }
    }
})